<template>
  <div id="app">
    <ul class="clearfix nav-list">
      <li class="fl">
        <router-link to="/">首页</router-link>
      </li>
      <li class="fl">
        <router-link to="/detail">详情</router-link>
      </li>
      <li class="fl">
        <router-link to="/aboutus">关于我们</router-link>
      </li>
    </ul>
    <div class="content">
      <router-view/>
    </div> 
  </div>
</template>

<script>
export default {
  name: 'App'
}
</script>

<style>
.nav-list{
  width:600px;
  margin:0 auto;
  line-height:60px;
  text-align:center;
}
.nav-list > li{
  width:calc(100% / 3);
  border:1px solid #ccc;
}
.content{
  text-align:center;
}
</style>
